$(function(){
	var cookieName = $.cookie('username')
	if(cookieName){
//		onerror当文件加载失败时会触发这个事件
		var header = '<img src="uploads/' + $.cookie('header') + '" onerror="this.src=\'images/user.png\'">' 
		$('#user').empty().html(header + cookieName)
	}
	$('.dropdown-menu li').last().click(function(){
		$.removeCookie('username')
		location.reload()
	})
	
	$('#user').click(function(){
		if(!cookieName){
			$(this).removeAttr('data-toggle')
			location.href = '/login.html'
		}
	})
	
//	提问跳转部分
	$('#ask').click(function(){
		if(cookieName){
			location.href = '/ask.html'
		}
		else{
			$('.modal-body p').text('请先登录')
			$('.modal').modal('show')
		}
	})

	// 回答跳转部分  此处必须采用事件委托的写法,因为需要对未来出现的.answer进行事件监听
	$('.question').delegate('.answer','click',function(){
		// 获取对应点击button的父元素ul的下标值
        var $index = $(this).parents('ul').index()
		$.cookie('index',$index)

		if(cookieName){
			location.href = '/answer.html'
		}
		else{
			$('.modal-body p').text('请先登录')
			$('.modal').modal('show')
		}
	})
	
	$('.modal-close').click(function(){
		$('.modal').modal('hide')
		.on('hidden.bs.modal',function(){
			location.href = '/login.html'
		})
	})

	// 请求问题数据
	$.get('/question').done(function(data){
		// console.log(data)
		var html = ''
		for(var i=0;i<data.length;i++){
			var arr = data[i]
			html += '<ul class="list-group">'
			html += '<li class="list-group-item list-group-item-success list-relative">'
			html += '<div class="list-header">'
			html += '<img src="uploads/' + arr.header + '" onerror = "this.src = \'images/user.png\'">'
			html += '<div class="info">'
			html += '<span>' + arr.username + '</span><span>' + getTime(arr.time) + '</span>'
			html += '</div></div>'
			html += '<div class="list-body">'
			html += '<p>' + arr.content + '</p>'
			html += '<button class="btn btn-success answer">我来回答</button></li>'
			if(arr.answer){
				var answer = arr.answer
				for(var j=0;j<answer.length;j++){
					var answer_content = answer[j]
					html += '<li class="list-group-item list-group-item-info list-relative">'
					html += '<div class="list-header">'
					html += '<img src="uploads/' + answer_content.header + '" onerror = "this.src = \'images/user.png\'" class="pull-right">'
					html += '<div class="info pull-right">'
					html += '<span>' + answer_content.username + '</span><span>' + getTime(answer_content.time) + '</span>'
					html += '</div></div>'
					html += '<div class="list-body">'
					html += '<p>' + answer_content.content + '</p>'
					html += '</div></li>'
				}
			}
			html += '</ul>'
		}
		$('.question').html(html)
	})
	function getTime(time){
		time = new Date(time)
		var month = time.getMonth() + 1
		var date = time.getDate()
		var hour = time.getHours()
		var minute = time.getMinutes()
		var second = time.getSeconds()

		hour = hour < 10 ? '0' + hour : hour
		minute = minute < 10 ? '0' + minute : minute
		second = second < 10 ? '0' + second : second

		return time.getFullYear() + '-' + month + '-' + date + ' ' + hour + ':' + minute + ':' + second
	}
})
